<template>
    <el-dialog
            :title="title"
            :visible.sync="isVisible"
            :width="width"
            :before-close="handleClose"
            :lock-scroll="true"
            :close-on-click-modal="false"
            custom-class="pub_dialog"
            @open="getData"
    >
        <VForm
                ref="vformComponents"
                :form="formData.form"
                :options="formData.options"
                :rules="formData.rules"
                :labelWidth="formData.labelWidth"
                :rowspan="rowspan"
        ></VForm>

        <span slot="footer" class="dialog-footer">
      <el-button @click="cancel">取 消</el-button>
      <el-button type="primary" @click="sure" v-if="openType!='detail'">确 定</el-button>
    </span>
    </el-dialog>
</template>

<script>
    import { publicAppealFollowReportDetail,
            publicAppealFollowReportUpdate,
            publicAppealFollowReportAdd } from '@/api/risk/publicAppealFollowReport'
    import VForm from "@/components/VForm/index";
    export default {
        components: {
            VForm,
        },
        props: {
            width: {
                type: String,
                default: "70%",
            },
            title: {
                type: String,
                default: "详情",
            },
            id:{},
            openType:{
                type:String,
                default:"add"
            },
            dialogVisible: {
                type: Boolean,
                default: false
            }
        },
        watch: {
          'areaTreeOptions':{
            handler(newVal, oldVal) {
              this.formData.options.forEach(t=> {
                if (t.key == 'areaCode') {
                  t.option.data = newVal
                }
              })
              console.log("wstchaa=========this.areaTreeOptions",this.areaTreeOptions)
            },
            deep: true,
            immediate: true
          },

          'width': {
                handler(newVal, oldVal) {
                    console.log('newVal===',newVal, oldVal)
                    let w = this.width.split('%')[0]
                    if(w>=60){
                        this.rowspan = 2
                    }else{
                        this.rowspan = 1
                    }
                },
                deep: true,
                immediate: true
            },
            'typeOptions':{
                handler(newVal, oldVal) {
                    this.formData.options.forEach(t=>{
                        if(t.key=='type'){
                        t.option.data = newVal
                    }
                })
                },
                deep: true,
                immediate: true
            },
            'openType':{
              handler(newVal, oldVal) {
                this.formData.options.forEach(t=>{
                  t.disabled =  newVal=='detail'
                })
              },
              deep: true,
              immediate: true
            }
        },
        computed: {
            isVisible: {
                get() {
                    return this.dialogVisible
                },
                set() {
                    this.close()
                }
            }
        },
        data() {
            return {
                rowspan:1,
                dict:{},
                formData: {
                    form: {
                            reportNum:"",
                            reportName:"",
                            reportTime:"",
                            code:"",
                            peoNum:"",
                            type:"",
                            uname:"",
                            ucode:"",
                            problem:"",
                            reportConent:"",
                            memo:"",
                            star6:"",
                            star5:"",
                            star4:"",
                            star3:"",
                            star2:"",
                            star1:"",
                            filePath:[],
                        },
                    options: [
                                   {
                                       title: "报告编号",
                                       key: "reportNum",
                                       type: "text",
                                   },
                                   {
                                       title: "报告名称",
                                       key: "reportName",
                                       type: "text",
                                   },
                                   {
                                       title: "调查时间",
                                       key: "reportTime",
                                       type: "date",
                                   },
                                  {
                                    title: "所属区域",
                                    key: "areaCode",
                                    type: "gdAreaSelect",
                                  },
                                   {
                                       title: "参数人数",
                                       key: "peoNum",
                                       type: "text",
                                   },
                                {
                                    title: "调查方法",
                                    key: "type",
                                    type: "select",
                                    multiple:false,
                                    option: {
                                        data: this.typeOptions,
                                        props: {
                                            key: "id", // 指定key对应data的字段
                                            label: "label", // 指定label对应data的字段
                                            value: "value", // 指定value对应data的字段
                                        },
                                    },
                                },
                                   {
                                       title: "主管单位名称",
                                       key: "uname",
                                       type: "text",
                                   },
                                   {
                                       title: "主管单位代码",
                                       key: "ucode",
                                       type: "text",
                                   },
                                  {
                                      title: "样本特征",
                                      key: "sample",
                                      type: "text"
                                  },
                                   {
                                       title: "调查范围",
                                       key: "problem",
                                       type: "textarea",
                                       columnWidth: 'w100max',
                                   },
                                   {
                                       title: "调查结果",
                                       key: "reportConent",
                                       type: "textarea",
                                       columnWidth: 'w100max',
                                   },
                                   {
                                       title: "重点关注问题",
                                       key: "memo",
                                       type: "textarea",
                                       columnWidth: 'w100max',
                                   },
                                   {
                                       title: "非常满意数量",
                                       key: "star6",
                                       type: "text",
                                   },
                                   {
                                       title: "满意数量",
                                       key: "star5",
                                       type: "text",
                                   },
                                   {
                                       title: "比较满意数量",
                                       key: "star4",
                                       type: "text",
                                   },
                                   {
                                       title: "一般数量",
                                       key: "star3",
                                       type: "text",
                                   },
                                   {
                                       title: "不满意数量",
                                       key: "star2",
                                       type: "text",
                                   },
                                   {
                                       title: "非常不满意数",
                                       key: "star1",
                                       type: "text",
                                   },

                                  {
                                    title: "上传附件",
                                    key: "filePath",
                                    type: "file",
                                    fileType:"file",
                                    listType:"text",
                                    uploadTextTip:""
                                  },
                    ],
                    rules: {
                        reportNum :[
                          {max:50, message: '长度最大为50个字符', trigger: 'blur'}
                        ],
                        reportName :[
                          {max:50, message: '长度最大为50个字符', trigger: 'blur'}
                        ],
                        reportTime :[
                        ],
                        code :[
                          {max:30, message: '长度最大为30个字符', trigger: 'blur'}
                        ],
                        peoNum :[
                        ],
                        type :[
                        ],
                        uname :[
                          {max:50, message: '长度最大为50个字符', trigger: 'blur'}
                        ],
                        ucode :[
                          {max:50, message: '长度最大为50个字符', trigger: 'blur'}
                        ],
                        problem :[
                          {max:1000, message: '长度最大为1000个字符', trigger: 'blur'}
                        ],
                        reportConent :[
                          {max:1000, message: '长度最大为1000个字符', trigger: 'blur'}
                        ],
                        memo :[
                          {max:1000, message: '长度最大为1000个字符', trigger: 'blur'}
                        ],
                        star6 :[
                        ],
                        star5 :[
                        ],
                        star4 :[
                        ],
                        star3 :[
                        ],
                        star2 :[
                        ],
                        star1 :[
                        ],

                    },
                    labelWidth: "140px",
                },
            // 字典
                typeOptions:[],
            };
        },
        methods: {
          submitFormat(){
            this.formData.form.filePath = JSON.stringify(this.formData.form.filePath);


          },
          loadFormat(){
            this.formData.form.filePath  = this.formData.form.filePath ? JSON.parse(this.formData.form.filePath) : [];

          },
            getCheckBoxData(value,option,type){
                if(type=="submit"){
                    if(value.length==0){
                        return null
                    }
                    let temp = [];
                    value.forEach(t=>{
                        let item = option.find(x=> x.label == t)
                    if(item!=undefined){
                        temp.push(item.value)
                    }
                })
                    return temp.join(",")
                }else {
                    if(!value){
                        return []
                    }else {
                        let data = value.split(",")
                        let temp = []
                        data.forEach(t=>{
                            let item = option.find(x=> x.value == t)
                        if(item!=undefined){
                            temp.push(item.label)
                        }
                    })
                        return temp
                    }
                }
            },
            sure(){
                console.log('sure===',this.formData.form)
                this.$refs.vformComponents.$refs.form.validate().then(res=>{
                    if(this.formData.form.areaCode){
                      let temp  = this.formData.form.areaCode
                      this.formData.form.provinceCode = temp[0]
                      this.formData.form.cityCode = temp[1]
                      this.formData.form.countyCode = temp[2]
                      this.formData.form.areaCode = temp[2]
                    }
                    this.submitFormat()
                    if(this.openType == "add"){
                        this.add()
                    }else{
                        this.update()
                    }
                })
            },
            add(){
                this.formData.form.id = null
                this.formData.form.delFlag=0;
                publicAppealFollowReportAdd(this.formData.form).then(res=>{
                    if(res.code==200){
                    this.$message({
                        message: this.$t('tips.createSuccess'),
                        type: 'success'
                    })
                    this.closeSuccess()
                    }else{
                    this.$message({
                        message: this.$t('tips.systemException'),
                        type: 'error'
                    })
                    }
                })
            },
            update(){
                   publicAppealFollowReportUpdate(this.formData.form).then(res=>{
                        if(res.code==200){
                        this.$message({
                             message: this.$t('tips.updateSuccess'),
                            type: 'success'
                        })
                        this.closeSuccess()
                      }else{
                        this.$message({
                            message: this.$t('tips.systemException'),
                            type: 'error'
                        })
                     }
                })
            },
            cancel(){
                this.close()
            },
            handleClose(done) {
                done()
                this.close()
            },
            closeSuccess(){
                this.$refs.vformComponents.$refs.form.resetFields();
                this.$emit('success')
            },
            close(){
                this.$refs.vformComponents.$refs.form.resetFields();
                this.$emit('close')
            },
            getData(){
              this.typeOptions = []
              this.$commonJs.filterDataDict("publicReportType",this.typeOptions )
                if(this.openType!="add"){
                    publicAppealFollowReportDetail(this.id).then(res=>{
                        if(res.code==200){
                            this.formData.form = res.data
                            this.loadFormat()
                            this.formData.form.areaCode = [res.data.provinceCode, res.data.cityCode, res.data.countyCode]
                         }else{
                            this.$message({
                                message: this.$t('tips.systemException'),
                                type: 'error'
                            })
                        }
                    })
                }
            }
        },
    };
</script>

<style lang="scss" scoped>

</style>
